<template>
  <div class="box">
    <ComponentA
      :propName="propName"
      :name="name"
      :isPublished="isPublished"
      :commentIds="commentIds"
      :author="author"
      @setAge="setAge"
      @click.native="handleClick"
      data-date-picker="activated"
    ></ComponentA>
  </div>
</template>

<script>
import ComponentA from './components/component-a'
export default {
  name: 'zujianchuanzhi',
  components: { ComponentA },
  data() {
    return {
      propName: 'success',
      name: '张三',
      isPublished: false,
      commentIds: [1, 2, 3],
      author: { name: '李四', age: 16 }
    }
  },
  methods: {
    handleClick() {
      console.log('将原生事件绑定到组件')
    },
    setAge(age) {
      console.log('age: ', age)
      this.author.age = age
    }
  }
}
</script>

<style lang="scss" scoped></style>
